<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>读取上传图片</title>
<style type="text/css">
</style>
</head>
<body>
<div id="result"></div>
	<input type="file" id="up" accept="image/*" name="path" value="" onchange="readImage()" />
<script>
var fileObj = document.getElementById('up');
var result = document.getElementById('result');
if(typeof FileReader == 'undefined') {
	result.innerHTML = '抱歉您的浏览器不支持直接显示图片';
}
function readImage() {
	var file = fileObj.files[0];
	if(!/image\/\w+/.test(file.type)){
		alert ('请上传支持的类型');
		return false;
	}
	var reader = new FileReader();
	reader.readAsDataURL(file);
	reader.onload = function (e) {
		result.innerHTML = '<img style="border:5px dotted #ccc;" src="'+this.result+'" />'
	}
}
</script>

</body></html>